<script setup lang="ts">
import { ref, provide } from 'vue'

import PromptView from './components/PromptView.vue'

import { getModels } from '@/services/completion'

const currentModel = ref('')

getModels().then((response) => {
  // get the filename from the path
  const modelName = response[0].id.replace(/^.*[\\/]/, '')
  currentModel.value = modelName
})

provide('currentModel', currentModel)
</script>

<template>
<header class="px-16 py-8 flex items-center justify-center">
  <svg xmlns="http://www.w3.org/2000/svg" width="106" height="20" viewBox="0 0 106 20" fill="none">
    <path d="M94.8743 9.59541C95.8586 9.95998 97.1197 10.2952 98.6547 10.6022C100.074 10.8898 101.127 11.1489 101.818 11.3791L101.82 11.38L101.823 11.3808C102.514 11.5881 103.078 11.9314 103.521 12.4086C103.947 12.8669 104.173 13.5348 104.173 14.4406C104.173 15.7488 103.652 16.7718 102.604
      17.5279L102.603 17.5288C101.562 18.292 100.236 18.6803 98.6106 18.6803C97.3012 18.6803 96.1788 18.4503 95.2379 17.9976C94.2964 17.5265 93.5779 16.8757 93.076 16.0456C92.5917 15.2148 92.3464 14.241 92.3464 13.1179V12.9304H90.9727V13.1179C90.9727 14.4609 91.2765 15.6638 91.8887 16.7211L91.8907
      16.7245C92.5225 17.765 93.4232 18.5714 94.5867 19.1439C95.7505 19.7166 97.0934 20 98.6106 20C99.8372 20 100.976 19.7985 102.025 19.3935C103.08 18.9866 103.928 18.3733 104.563 17.5518C105.222 16.7046 105.547 15.6728 105.547 14.4676C105.547 13.2688 105.252 12.3103 104.637 11.6177C104.057 10.9446
      103.336 10.4673 102.477 10.187C101.656 9.89508 100.504 9.59639 99.0269 9.29011C97.572 8.98475 96.4463 8.69853 95.6465 8.43193C94.8595 8.1696 94.2298 7.79669 93.7504 7.31762C93.2872 6.83732 93.0482 6.19489 93.0482 5.37042C93.0482 4.45329 93.2981 3.70633 93.787 3.11571C94.3039 2.51305 94.9685
      2.06316 95.786 1.76747C96.6098 1.4695 97.4968 1.31973 98.4487 1.31973C99.52 1.31973 100.49 1.53909 101.361 1.97483L101.364 1.97614C102.234 2.39363 102.918 2.99167 103.42 3.77131C103.92 4.54782 104.173 5.44762 104.173 6.4772V6.66466H105.547V6.4772C105.547 5.22055 105.232 4.09607 104.599
      3.10963C103.968 2.12628 103.106 1.36614 102.015 0.829907C100.944 0.275856 99.7625 0 98.4757 0C97.1415 0 95.9548 0.219334 94.9195 0.663023L94.9184 0.663516C93.9008 1.10753 93.0984 1.73996 92.5186 2.56298L92.5169 2.56536C91.9539 3.39111 91.6745 4.34646 91.6745 5.42441C91.6745 6.46714 91.9546
      7.34009 92.5278 8.02793L92.5296 8.03009L92.5315 8.03221C93.1127 8.68842 93.895 9.20752 94.8703 9.59394L94.8743 9.59541Z" fill="#FFAF52" />
    <path fill-rule="evenodd" clip-rule="evenodd" d="M72.9307 19.5948H74.3044V13.8989H80.6766C82.0308 13.8989 83.2041 13.6519 84.1899 13.1497C85.3182 12.5763 86.2082 11.7516 86.8563 10.678C87.5224 9.60443 87.8557 8.42769 87.8557 7.15179C87.8557 5.82426 87.5325 4.64581 86.8816 3.62284C86.233 2.60369
      85.3523 1.81617 84.2433 1.26156C83.1539 0.7077 81.9639 0.431641 80.6766 0.431641H72.9307V19.5948ZM85.6477 10.0471C85.0906 10.9177 84.3525 11.5686 83.4311 12.0032L83.4289 12.0043C82.7248 12.3478 81.8107 12.5252 80.6766 12.5252H74.3044V1.80537H80.6766C81.7921 1.80537 82.6974 1.98269 83.4018
      2.32631L83.4053 2.32791C84.3448 2.76285 85.0911 3.41379 85.6477 4.28344C86.204 5.15275 86.4819 6.10742 86.4819 7.15179C86.4819 8.2148 86.2037 9.17836 85.6477 10.0471Z" fill="#FFAF52" />
    <path fill-rule="evenodd" clip-rule="evenodd" d="M63.6525 18.9491L63.6543 18.948C64.8694 18.23 65.8283 17.2621 66.5283 16.0466C67.2472 14.8297 67.6066 13.5012 67.6066 12.0649V7.96176C67.6066 6.52548 67.2472 5.19704 66.5283 3.98012C65.8282 2.76443 64.8691 1.80531 63.6534 1.10516C62.4365 0.386294
      61.108 0.0268555 59.6717 0.0268555C58.2354 0.0268555 56.907 0.386301 55.69 1.10518C54.4745 1.80525 53.5067 2.76408 52.7887 3.97918L52.7876 3.98101C52.087 5.19793 51.7368 6.52605 51.7368 7.96176V12.0649C51.7368 13.5007 52.087 14.8288 52.7876 16.0457L52.7887 16.0475C53.5066 17.2625 54.4742 18.23
      55.6891 18.948L55.691 18.9491C56.9079 19.6497 58.236 19.9998 59.6717 19.9998C61.1074 19.9998 62.4356 19.6497 63.6525 18.9491ZM65.3408 15.3715L65.3403 15.3723C64.7631 16.3694 63.9679 17.165 62.9516 17.7608C61.9554 18.3374 60.8634 18.6261 59.6717 18.6261C58.4805 18.6261 57.3793 18.3376 56.3648
      17.7608C55.367 17.1653 54.5714 16.3696 53.9759 15.3719C53.399 14.3574 53.1105 13.2562 53.1105 12.0649V7.96176C53.1105 6.77006 53.3992 5.67801 53.9759 4.68184C54.5717 3.6656 55.3673 2.87038 56.3643 2.29317L56.3652 2.29266C57.3799 1.69784 58.4809 1.40058 59.6717 1.40058C60.8625 1.40058 61.954
      1.69781 62.95 2.29193L62.9533 2.29387C63.9678 2.87108 64.7624 3.66565 65.3396 4.68014L65.3416 4.68347C65.9357 5.67949 66.2329 6.77095 66.2329 7.96176V12.0649C66.2329 13.2558 65.9357 14.3568 65.3408 15.3715Z" fill="#FFAF52" />
    <path d="M50.0117 1.80537V0.431641H34.4658V1.80537H41.5654V19.5948H42.9121V1.80537H50.0117Z" fill="#FFAF52" />
    <path d="M30.3268 1.84785V0.474121H20.0269V1.84785H24.49V18.2636H20.0269V19.6373H30.3268V18.2636H25.8367V1.84785H30.3268Z" fill="#FFAF52" />
    <path fill-rule="evenodd" clip-rule="evenodd" d="M15.924 0.286621L7.88784 8.32278L15.8357 19.4498H0.166992V0.286621H15.924ZM1.54072 18.0761V14.6699L6.91721 9.29341L13.1905 18.0761H1.54072Z" fill="#FFAF52" />
    <path d="M0.166992 16.0335V0.286621H15.924L0.166992 16.0335Z" fill="#ECECEC" />
  </svg>
  <span class="mx-2.5 text-gray-05">/</span>
  <span>{{ currentModel }}</span>
</header>

<main class="w-full flex-1 xs:p-4 flex flex-col">
  <PromptView />
</main>

<footer class="text-gray-05 py-4 text-center">
  Powered by <a href="https://github.com/ggerganov/llama.cpp" class="underline" target="_blank">llama.cpp</a> and <a href="http://ggml.ai" class="underline" target="_blank">ggml.ai</a>
</footer>
</template>
